<template>
  <el-container>
    <component :is="currentPage" @toChangePage="changePage" :row="row"/>
  </el-container>
</template>

<style scoped>
  .fade-enter-active, .fade-leave-active {
    transition: opacity 1s;
  }
  .fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
    opacity: 0;
  }
</style>

<script>
import list from './module/index'
import add from './module/add'
import edit from './module/edit'
export default {
  components: {
    list,
    add,
    edit
  },
  data: function() {
    return {
      row: {},
      currentPage: 'list'
    }
  },
  created() {

  },
  methods: {
    changePage(page, row) {
      this.row = row
      if (!page) {
        page = 'list'
      }
      this.currentPage = page
    }
  }
}
</script>
